<template>
    <div class="search">
        <div class="van-search">
            <van-search
                v-model="param.keyword"
                show-action
                background="#fff"
                placeholder="请输入搜索关键词"
                @cancel="onCancel"
                @search="onLoad"
                />
        </div>
        <div class="main">
            <van-empty v-if="!list.length" description="" />
            <VCard v-else :cardData="list"/>
        </div>
    </div>
</template>

<script lang="ts" setup>
    import VCard from "../../components/home/Card.vue"
    import { getPosition } from '../../api/home.js'
    import { ref, reactive,getCurrentInstance, watch} from 'vue'
    import { useRoute ,useRouter} from 'vue-router'
    const { proxy } = getCurrentInstance()
	const _this = proxy;
	const route = useRoute()
    const router = useRouter()
	const list = ref([]);
    const loading = ref(false);
    const finished = ref(false);
	const refreshing = ref(false);
	const param = reactive({
		pageNum:1,	//pageNum
		pageSize: 10,//每页个数
		keyword:''
	})
    
    param.keyword = route.query.search
	const onLoad = async () => {
        _this.list=[]
        _this.param.pageNum = 1
     // 异步更新数据
	  await getPosition(param).then(res=>{
		// console.log(res.data)
		  // 加载状态结束
		  if(res.code === 200){
			_this.list = _this.list.concat(res.data.records)
			_this.loading = false;
			setTimeout(()=>{
				_this.refreshing = false	
			},200)
		  }
		  // 数据全部加载完成
		  if (_this.param.pageNum >= res.data.pages) {
			_this.finished= true;
		  }
	  })
	  _this.param.pageNum++
    };
    const onSearch = (val) => onLoad();
    const onCancel = () => {
        _this.param.keyword='';
        _this.list=[]
        router.push({path:'index'})
        };
</script>

<style lang="scss" scoped>
.search{
    .van-search{
        position: fixed;left: 0;top: 0;width: 100%;
    }
}
</style>
